<template>

    <div>
        <el-form :model="model" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="通知单编号" prop="Number">
                        <el-input v-model="model.Number" placeholder="请选择通知单编号" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="币种" prop="Currency">
                        <el-input v-model="model.Currency" placeholder="币种" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="收货地址" prop="Address">
                        <el-input v-model="model.Address" placeholder="币种" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>

                <el-col :span="8">
                    <el-form-item label="供应商名称" prop="VendorName">
                        <el-input v-model="model.VendorName" placeholder="请选择供应商名称" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="联系人" prop="VendorContact">
                        <el-input v-model="model.VendorContact" placeholder="联系人" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="联系人电话" prop="VendorContactTel">
                        <el-input v-model="model.VendorContactTel" placeholder="联系人电话" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>


            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="入库仓" prop="WarehouseId">
                        <el-input v-model="model.WarehouseId" placeholder="入库仓" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="交货日期" prop="DeliveryDate">
                        <el-input v-model="model.DeliveryDate" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="不含税总价" prop="Total">
                        <el-input v-model="model.Total" placeholder="请输入不含税总价" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>

            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="含税总价" prop="TaxTotal">
                        <el-input v-model="model.TaxTotal" placeholder="请输入含税总价" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="到货时间" prop="ReceiveDate">
                        <el-input v-model="model.ReceiveDate" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="到货单状态" prop="Status">

                        <el-tag type="info" v-if="model.Status == '0'">待审核</el-tag>
                        <el-tag type="success" v-else-if="model.Status == '1'">已审核</el-tag>
                        <el-tag type="danger" v-else-if="model.Status == '2'">已入库</el-tag>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>

            </el-row>
        </el-form>
        <div style="border: 1px solid #dcdfe6; padding: 10px;">
            <h1 style="margin: 10px;">产品</h1>

            <el-table :data="tableData" ref="dataForm" v-loading="isLoading" height="360">

                <el-table-column type="selection" width="70"></el-table-column>
                <el-table-column prop="ItemCode" label="产品ID" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="ItemName" label="物料名称" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Model" label="型号" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Spec" label="规格" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="UnitOfMeasure" label="单位" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Count" label="采购数量" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Quantity" label="到货数量" :show-overflow-tooltip="true"></el-table-column>

                <el-table-column prop="Price" label="采购价" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Tax" label="税率" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="TaxAmount" label="含税总价" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Amount" label="不含税总价" :show-overflow-tooltip="true"></el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
export default {
    props:{
        model:{
            require:true,
            type:Object,
        }
    },
    data(){
        return{
            tableData:[],
            isLoading:false,
        }
    },
    created(){
        this.GetWareHouseInboundBillIdAsync();
    },
    methods:{
        GetWareHouseInboundBillIdAsync(){
              this.isLoading=true;
              this.$http.get('/api/WareHouseInboundBill/GetWareHouseInboundBillIdAsync',{
                  params:{
                    WareHouseInboundBillId:this.model.Id,
                      WarehouseId: this.model.WarehouseId
                  }
              })
              .then(res=>{
                  console.log(res)
                  this.isLoading=false;
                  this.tableData=res.Data;
              })
          },
    }
}
</script>

<style>

</style>